<template>
  <div class="JNPF-common-layout">
    <div class="JNPF-preview-main">
      <div class="JNPF-common-page-header">
        <p>企业介绍</p>
        <div class="options">
          <el-button type="primary" @click="dataFormSubmit()"> 保 存</el-button>
          <el-button @click="resetForm">重置</el-button>
        </div>
      </div>
      <el-row :gutter="15" class=" main" :style="{margin: '0 auto',width: '100%'}">
        <el-form ref="elForm" :model="dataForm" :rules="rules" size="small" label-width="100px" label-position="right">
          <template v-if="!loading">
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="企业LOGO" prop="logo">
                  <JNPF-UploadImg v-model="dataForm.logo" :fileSize="5" sizeUnit="MB" :limit="1">
                  </JNPF-UploadImg>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="企业图片" prop="picture">
                  <JNPF-UploadImg v-model="dataForm.picture" :fileSize="5" sizeUnit="MB" :limit="1">
                  </JNPF-UploadImg>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
              <el-form-item label="企业简介" prop="shortInfo" >
                <el-input v-model.trim="dataForm.shortInfo" placeholder="请输入企业简介" maxlength="200">
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="企业介绍" prop="info" >
                <JNPF-Quill v-model.trim="dataForm.info" placeholder="请输入企业介绍" >
                </JNPF-Quill>
              </el-form-item>
            </el-col>
          </template>
        </el-form>
      </el-row>
    </div>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import {
    getDataInterfaceRes
  } from '@/api/systemData/dataInterface'
  import {
    getDictionaryDataSelector
  } from '@/api/systemData/dictionary'
  export default {
    components: {},
    props: [],
    data() {
      return {
        visible: false,
        loading: false,
        btnLoading: false,
        selectDialogVisible: false,
        currTableConf: {},
        addTableConf: {},
        tableRows: {},
        dataForm: {
          logo: [],
          picture: [],
          shortInfo: '',
          info: '',
        },
        rules: {
          logo: [{
            required: true,
            message: '请至少选择一张图片',
            trigger: 'click'
          }],
          picture: [{
            required: true,
            message: '请至少选择一张图片',
            trigger: 'click'
          }],
          shortInfo: [{
            required: true,
            message: '请输入不超过200字!',
            trigger: 'blur',
          }],
          info: [{
            required: true,
            message: '请输入企业介绍!',
            trigger: 'blur',
          }],
        },
      }
    },
    computed: {},
    watch: {},
    created() {
      this.getInfo()
    },
    mounted() {},
    methods: {
      goBack() {
        this.$emit('refresh')
      },
      init() {
        this.pictureList = []
      },
      getInfo() {
        request({
          url: `/api/zgyf/VipEnterpriseInfo/getInfo`,
          method: 'get'
        }).then((res) => {
          if (res.data && res.data.id) {
            this.dataInfo(res.data)
            console.log('$$$$',res.data)
            this.loading = false
          }
        }).catch()
      },
      // 表单提交
      dataFormSubmit() {
        this.$refs['elForm'].validate((valid) => {
          if (valid) {
            var _data = this.dataList()
            request({
              url: `/api/zgyf/VipEnterpriseInfo`,
              method: 'post',
              data: _data
            }).then((res) => {
              this.$message({
                message: res.msg,
                type: 'success',
                duration: 1000,
                onClose: () => {
                }
              })
            })
          }
        })
      },
      resetForm() {
        this.$refs['elForm'].resetFields()
        this.init()
      },
      openSelectDialog(key) {
        this.currTableConf = this.addTableConf[key]
        this.currVmodel = key
        this.selectDialogVisible = true
        this.$nextTick(() => {
          this.$refs.selectDialog.init()
        })
      },
      addForSelect(data) {
        for (let i = 0; i < data.length; i++) {
          let item = {
            ...this.tableRows[this.currVmodel],
            ...data[i]
          }
          this.dataForm[this.currVmodel].push(item)
        }
      },
      dataList() {
        var _data = JSON.parse(JSON.stringify(this.dataForm));
        _data.picture = Array.isArray(_data.picture) ? JSON.stringify(_data.picture) : '[]'
        _data.logo = Array.isArray(_data.logo) ? JSON.stringify(_data.logo) : '[]'
        return _data;
      },
      dataInfo(dataAll){
        let _dataAll =dataAll
        _dataAll.picture = JSON.parse(_dataAll.picture)
        _dataAll.logo = JSON.parse(_dataAll.logo)
        this.dataForm = _dataAll
      }
    }
  }
</script>
